<template>
  <el-dialog v-model="Oppen1" title="Tips" width="1000px">
    <el-form :model="form" label-width="auto">

      <el-form-item>
        用户名:
        <el-input v-model="form.user_Name" style="width: 200px;" placeholder="请输入用户名" />部门:
        <el-select v-model="form.department_Id" placeholder="请选择部门" style="width: 200px;">
          <el-option v-for="select in DepartmentList" :label="select.department_Name" :value="select.department_Id" />
        </el-select>
      </el-form-item>

      <el-form-item>
        工号:
        <el-input v-model="form.user_WorkCode" style="width: 200px;"placeholder="自动生成工号" disabled="disabled"/> 角色:
        <el-select v-model="form.role_Id" placeholder="请选择角色" style="width: 200px;">
          <el-option v-for="select in roleList" :label="select.role_Name" :value="select.role_Id" />
        </el-select>
      </el-form-item>

      <el-form-item>
        姓名:
        <el-input v-model="form.real_Name" style="width: 200px;" />电话:
        <el-input v-model="form.user_Phone" style="width: 200px;" />
      </el-form-item>

      <el-form-item>
        手机:
        <el-input v-model="form.user_FixedPhone" style="width: 200px;" />邮箱:
        <el-input v-model="form.user_Email" style="width: 200px;" />

      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="AddOppen()">提交</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>

  </el-dialog>

  <el-dialog v-model="Oppen2" title="Tips" width="1000px">
    <el-form :model="formUpdate" label-width="auto">

      <el-form-item>
        用户名:
        <el-input v-model="formUpdate.user_Name" style="width: 200px;" placeholder="请输入用户名" />部门:
        <el-select v-model="formUpdate.department_Id" placeholder="请选择部门" style="width: 200px;">
          <el-option v-for="select in DepartmentList" :label="select.department_Name" :value="select.department_Id" />
        </el-select>
      </el-form-item>

      <el-form-item>
        工号:
        <el-input v-model="formUpdate.user_WorkCode" style="width: 200px;" /> 角色:
        <el-select v-model="formUpdate.role_Id" placeholder="请选择角色" style="width: 200px;">
          <el-option v-for="select in roleList" :label="select.role_Name" :value="select.role_Id" />
        </el-select>
      </el-form-item>

      <el-form-item>
        姓名:
        <el-input v-model="formUpdate.real_Name" style="width: 200px;" />电话:
        <el-input v-model="formUpdate.user_Phone" style="width: 200px;" />
      </el-form-item>

      <el-form-item>
        手机:
        <el-input v-model="formUpdate.user_FixedPhone" style="width: 200px;" />邮箱:
        <el-input v-model="formUpdate.user_Email" style="width: 200px;" />

      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="Update()">修改</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>

  </el-dialog>

  <el-dialog v-model="Oppen3" title="Tips" width="400px">
    <el-form  label-width="auto">

      <el-form-item>
        密码:<el-input v-model="PwdUpdate.user_PassWord" show-password />
      </el-form-item>

      <el-form-item>
        确认密码:
        <el-input v-model="checkpwd.user_PassWord" show-password />
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="UpdatePass()">修改密码</el-button>
      </el-form-item>
    </el-form>

  </el-dialog>

  <el-dialog v-model="LogExport" width="500">
    <el-form :model="ExportCouts" label-width="auto" style="max-width: 600px">
      <el-form-item label="导出数据" >
        <el-input v-model="ExportCouts.cout" type="text" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="AllExport()">导出</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>



  <el-form :inline="true" :model="formInline" class="demo-form-inline">

    <el-form-item label="用户名">
      <el-input v-model="formInline.username" placeholder="请输入用户名" clearable />
    </el-form-item>

    <el-form-item label="工号">
      <el-input v-model="formInline.number" placeholder="请输入工号" clearable />
    </el-form-item>

    <el-form-item label="部门信息">
      <el-select v-model="formInline.department_Id" style="width: 200px;" placeholder="请选择部门信息">

        <el-option v-for="select in DepartmentList" :label="select.department_Name" :value="select.department_Id" />
      </el-select>
    </el-form-item>

    <el-form-item label="角色信息">
      <el-select v-model="formInline.role_Id" style="width: 200px;" placeholder="请选择角色信息">
        <el-option v-for="select in roleList" :label="select.role_Name" :value="select.isDel" />
      </el-select>
    </el-form-item>

    <el-form-item>
      <el-button type="primary" @click="Show()">查询</el-button>
    </el-form-item>
  </el-form>

  <el-form :inline="true">
    <el-form-item>
      <el-button type="primary" @click="OppAddOppenen1()">新增</el-button>
      <el-button type="primary" @click="Edit(1)">编辑</el-button>
      <el-button type="primary" @click="DeleteAll()">删除</el-button>
      <el-button type="primary" @click="Show()">刷新</el-button>
      <el-button type="primary" @click="OppenExports()">导出</el-button>
    </el-form-item>
  </el-form>

  <el-table :data="tableData" style="width: 100%" @selection-change="handleSelectionChange">
    <el-table-column prop="uId" label="序号" width="auto">
      <template v-slot="scope">
        <el-checkbox-group v-model="addIds">
          <el-checkbox :value="scope.row.uId">{{ scope.row.uId }}</el-checkbox>
        </el-checkbox-group>
      </template>
    </el-table-column>

    <el-table-column prop="user_WorkCode" label="工号" width="auto" />
    <el-table-column prop="user_Name" label="用户名" width="auto" />
    <el-table-column prop="role_Name" label="角色" width="auto" />
    <el-table-column prop="user_Email" label="邮件" width="auto" />
    <el-table-column prop="user_Phone" label="手机号" width="auto" />
    <el-table-column prop="user_FixedPhone" label="固定手机号" width="auto" />
    <el-table-column prop="createTime" label="创建时间" width="auto" />
    <el-table-column prop="login_Number" label="登录次数" width="auto" />
    <el-table-column prop="department_Name" label="部门" width="auto" />
    <el-table-column label="操作" width="auto">
      <template v-slot="scoped">
        <el-button type="text" @click="Edit(scoped.row.uId)">编辑</el-button>
        <el-button type="text" @click="Delete(scoped.row.uId)">删除</el-button>
        <el-button type="text" @click="ResetPass(scoped.row.uId)">重置密码</el-button>
      </template>
    </el-table-column>
  </el-table>
      <table>
        <thead>
            <tr>
                <td>
                    <el-pagination v-model:current-page="Page.pageIndex" v-model:page-size="Page.pageSize"
                        :page-sizes="[15, 20, 30, 40]" :background="true"
                        layout="total, sizes, prev, pager, next, jumper,slot" :total="Page.total" prev-text="上一页"
                        next-text="下一页">
                        共{{ Page.total }}条，共{{ Page.pageIndex }}\{{ Page.totalPage }}页
                    </el-pagination>
                </td>
            </tr>
        </thead>
    </table>
  <div class="table-footer">
    <div class="batch-actions">
      <el-button size="small" @click="selectAll()">全选</el-button>
      <el-button size="small" @click="reverseSelect()">反选</el-button>
      <el-select size="small" placeholder="批量操作" style="width: 120px;">
        <el-option label="批量删除" value="delete" @click="DeleteAll()" />
        <el-option label="批量导出" value="export" @click="OppenExportsAll()" />
      </el-select>
    </div>
  </div>
</template>

<script lang="ts" setup>
import axios from 'axios'
import { ElMessage } from 'element-plus'
import { onMounted, reactive, ref,watch } from 'vue'
import { http } from '@/axios/axiosHelpers'
import { systeamread } from '@/systeamaxios/sysaxiosHelpers'
const Oppen1 = ref(false)
const Oppen2 = ref(false)
const Oppen3 = ref(false)
const LogExport = ref(false)
const Page = reactive({
  pageIndex: 1,
  pageSize: 15,
  total: 0,
  totalPage: 0
})
const PwdUpdate = reactive({
  "uId": 0,
  "user_PassWord": "",
})
const checkpwd = reactive({
  "user_PassWord": "",
})
const ExportCouts = reactive({
  cout: ""
})
const addIds = ref<any>([])
//表格加入
const form = reactive({
  "user_WorkCode": "",
  "user_Name": "",
  "real_Name": "",
  "user_PassWord": "",
  "role_Id": 0,
  "user_Email": "",
  "user_Phone": 0,
  "user_FixedPhone": 0,
  "login_Number": 0,
  "department_Id": 0,
  "user_IsDel": false
})
const formUpdate = reactive({
  "uId": 0,
  "user_WorkCode": "",
  "user_Name": "",
  "real_Name": "",
  "user_PassWord": "",
  "role_Id": 0,
  "user_Email": "",
  "user_Phone": 0,
  "user_FixedPhone": 0,
  "login_Number": 0,
  "department_Id": 0,
  "user_IsDel": false
})
const bt = reactive({
  bid: 0
})
const formInline = reactive({
  username: '',
  number: '',
  department_Id: '',
  role_Id: ''
})
const tableData = ref([{
        "uId": 0,
        "user_WorkCode": "string",
        "user_Name": "string",
        "user_PassWord": "string",
        "user_Email": "string",
        "user_Phone": 0,
        "user_FixedPhone": 0,
        "createTime": "2025-08-04T11:45:55.193Z",
        "login_Number": 0,
        "user_IsDel": false,
        "role_Id": 0,
        "role_Name": "",
        "role_CreateTime": "2025-08-04T11:45:55.193Z",
        "role_Content": "",
        "role_IsDel": false,
        "rid": 0,
        "department_Id": "",
        "department_Name": "",
        "parent_Department": "",
        "department_IsDel": false
}])


const DepartmentList = ref([{
  "department_Name": "",
  "parent_Department": "",
  "createTime": "2025-07-24T10:57:31",
  "department_IsDel": false,
  "department_Id": "",
  "isDel": false
}])
const roleList = ref([{
  "role_Id": "",
  "isDel": false,
  "role_Name": "",
  "role_CreateTime": "",
  "role_Content": "",
  "role_IsDel": false
}])

const selectDepartment = () => {
  // http.get("/managementsysteamreadapis/api/DepartMentAll/ShowDepartMent")
   systeamread.get("/api/DepartMentAll/ShowDepartMent")
    .then(res => {
      DepartmentList.value = res.data.data
    })
}
const selectRole = () => {
  // http.get("/managementsysteamreadapis/api/RoleAll/ShowRole")
   systeamread.get("/api/RoleAll/ShowRole",{
    params:{
      PageIndex:1,
      PageSize:1000
    }
   })
    .then(res => {
      roleList.value = res.data.data.data
    })
}
const AddOppen = () => {
  // http.post("/managementsysteamreadapis/api/UserValues/AddUser", form)
 systeamread.post("/api/UserValues/AddUser", form)
    .then(res => {
      if (res.data.code > 0) {
        ElMessage.success(res.data.message)
        Oppen1.value = false
      }
      else {
        ElMessage.success(res.data.message)
      }
    })
}
//保存选中的id存值测试
const handleSelectionChange = (selection: any[]) => {
  addIds.value = selection.map(item => item.uId)
}
//全部选中id
const selectAll = () => {
  addIds.value = tableData.value.map(item => item.uId)
}
//反选
const reverseSelect = () => {
  addIds.value = tableData.value.filter(item => !addIds.value.includes(item.uId)).map(item => item.uId)
}
const OppAddOppenen1 = () => {
  addIds.value = []
  Oppen1.value = true
}
const OppenExports = () => {
  LogExport.value = true
}
const UpdatePass = () => {
  if(PwdUpdate.user_PassWord!=checkpwd.user_PassWord)
{
  ElMessage.success("两次密码不一致")
  return;
}
  
  PwdUpdate.uId = bt.bid
  // http.put("/managementsysteamreadapis/api/UserValues/UpdatePassWord", PwdUpdate)
  systeamread.get("/api/UserValues/UpdatePassWord",{
    params:{
      UId:PwdUpdate.uId,
      User_PassWord:PwdUpdate.user_PassWord
    }
  })
    .then(res => {

        ElMessage.success(res.data.message)
        Oppen3.value = false
        Show()
    })
}
onMounted(() => {
  Show()

})
watch(Page,()=>{
  Show()
})
const fistuse = () => {
  // http.get("/managementsysteamreadapis/api/UserValues/FistUsers",{
  systeamread.get("/api/UserValues/FistUsers",{
    params:{
      Id:bt.bid
    }
  }).then(res=>{
    formUpdate.user_WorkCode = res.data.data.user_WorkCode
    formUpdate.user_Name = res.data.data.user_Name
    formUpdate.real_Name = res.data.data.real_Name
    formUpdate.user_PassWord = res.data.data.user_PassWord
    formUpdate.role_Id = res.data.data.role_Id
    formUpdate.user_Email = res.data.data.user_Email
    formUpdate.user_Phone = res.data.data.user_Phone
    formUpdate.user_FixedPhone = res.data.data.user_FixedPhone
    formUpdate.login_Number = res.data.data.login_Number
    formUpdate.department_Id = res.data.data.department_Id
    formUpdate.real_Name = res.data.data.real_Name
    formUpdate.user_IsDel = res.data.data.user_IsDel
    
  })
}
const ResetPass = (id: number) => {
  bt.bid = id
  Oppen3.value = true

}
const AllExport = () => {
  
  // let url = +"http://112.126.93.146:8000/managementsysteamreadapis/api/ExportAll/Export?NumCout=" + ExportCouts.cout;
  let url = +"http://localhost:5293/api/ExportAll/Export?NumCout=" + ExportCouts.cout;
  window.location.href = url
  LogExport.value = false
}
const OppenExportsAll = () => {
  // let url = +"http://112.126.93.146:8000/managementsysteamreadapis/api/ExportAll/ExportAll?Ids=" + addIds.value.toString();
  let url = +"http://localhost:5293/api/ExportAll/ExportAll?Ids=" + addIds.value.toString();
  window.location.href = url
  addIds.value = []
}

const Show = () => {

  // http.get("/managementsysteamreadapis/api/UserValues/ShowUser")
  systeamread.get("/api/UserValues/ShowUser",{
    params:{
     PageIndex:Page.pageIndex,
     PageSize:Page.pageSize,
    }
  })
    .then(res => {
      tableData.value = res.data.data.data
      Page.total = res.data.total
      selectDepartment()
      addIds.value = []
      selectRole()
    })
}

const DeleteAll = () => {
  if (!confirm("确定删除吗"))
    return;
  // http.get("/managementsysteamreadapis/api/UserValues/DelUserAll", {
  systeamread.get("/api/UserValues/DelUserAll", {
    params: {
      Ids: addIds.value.toString()
    }
  })
    .then(res => {
      ElMessage.success(res.data.message)
      Show()
    })
}
const Delete = (id: number) => {
  if (!confirm("确定删除吗"))
    return;
  // http.delete("/managementsysteamreadapis/api/UserValues/DelUser", {
  systeamread.delete("/api/UserValues/DelUser", {
    params: {
      id: id
    }
  })
    .then(res => {
      ElMessage.success(res.data.message)
      Show()
    })
}
const Edit = (id: number) => {

  bt.bid = id
  Oppen2.value = true
  fistuse()
}
const Update = () => {
  formUpdate.uId = bt.bid
  // http.put("/managementsysteamreadapis/api/UserValues/UpdateUser", formUpdate)
  systeamread.put("/api/UserValues/UpdateUser", formUpdate)
    .then(res => {

        ElMessage.success(res.data.message)
        Oppen2.value = false
        Show()
    })
}
</script>